import { DeliverLogModel } from '@/models/deliverLog'
import { getCustomerChannelList } from '@/services/CustomerChannelService'
import { DeliverLogVO, getDeliverLogPage, removeDeliverLog } from '@/services/DeliverLogService'
import { ProColumns, ProTable } from '@ant-design/pro-components'
import { useRequest } from 'ahooks'
import { Button, Popconfirm, Space } from 'antd'

export interface DeliverLogProps {
  tableRef?: any
  setIsAdd: any
}

const DeliverLogTable = (props: DeliverLogProps) => {
  let { actions: notifyActions } = DeliverLogModel
  let { data: channelList } = useRequest(getCustomerChannelList)

  const columns: ProColumns<DeliverLogVO>[] = [
    {
      dataIndex: 'id',
      hideInTable: true,
      hideInSearch: true,
    },
    {
      title: '渠道',
      dataIndex: 'channelId',
      valueType: 'select',
      valueEnum:
        channelList &&
        channelList.reduce((acc, curr) => {
          acc[curr.id] = {
            text: curr.channelName,
          }
          return acc
        }, {}),
    },

    {
      title: '投放资金',
      dataIndex: 'fee',
      hideInSearch: true,
      valueType: 'money',
      render: (_, record) => `¥${record.fee / 100}`,
    },
    {
      title: '投放时间',
      dataIndex: 'deliverTime',
      hideInSearch: true,
    },
    {
      title: '操作',
      render: (_: any, record: DeliverLogVO) => [
        <Space key="operate">
          {' '}
          {
            <Button
              type="link"
              size="small"
              onClick={() => {
                props.setIsAdd(false)
                notifyActions.openUpdateModal(true, record)
              }}
            >
              {' '}
              编辑{' '}
            </Button>
          }
          {
            <Popconfirm
              title="确定要删除吗"
              onConfirm={() => {
                removeDeliverLog([record.id]).then(() => props.tableRef?.current?.reload())
              }}
              okText="确认"
              cancelText="取消"
            >
              <Button type="link" danger size="small">
                删除
              </Button>
            </Popconfirm>
          }
        </Space>,
      ],
      hideInSearch: true,
    },
  ]

  // 工具栏
  let actions = [
    <Button
      key="create"
      type="primary"
      onClick={() => {
        props.setIsAdd(true)
        notifyActions.openUpdateModal(true, undefined)
      }}
    >
      添加
    </Button>,
  ]
  return (
    <>
      <ProTable
        actionRef={props.tableRef}
        columns={columns}
        request={getDeliverLogPage}
        toolbar={{
          actions: actions,
        }}
        scroll={{ x: 500 }}
        sticky={{ offsetHeader: 55, offsetScroll: 5 }}
      ></ProTable>
    </>
  )
}

export default DeliverLogTable
